<template>
	<el-dialog class="abow-dialog" v-dialogDrag :visible.sync="visible" top="10vh" title="订单详情"
		:close-on-click-modal="false" :close-on-press-escape="false" width="700px">

		<div class="d-flex flex-column">
			<div class="d-flex flex-row font-md mb-10">
				<div class="d-flex text-orangedeep">
					{{'订单ID '+orderInfoData.id}}
				</div>
			</div>
			<div class="d-flex flex-column a-cneter" v-loading="initloadding" element-loading-text="正在获取中"
				style="height: 320px;overflow-y: auto;">
				<template v-if="orderDetail&&orderDetail.code==200">
					<el-descriptions title="" :column="1" border labelClassName="labelClass">
						
						<el-descriptions-item v-if="orderDetail.status!=2" label="最低上报金额">{{orderDetail.minimun_report_amount}}</el-descriptions-item>
				
						<el-descriptions-item v-if="orderDetail.status!=2" label="回传过滤">
							<el-form class="d-flex flex-row">
								<el-form-item style="margin-bottom: 0;">
									<el-input class="" v-model="orderDetail.backhaul_filterate_num" :disabled="true" placeholder="请输入"
										clearable>
										<template slot="prepend">每</template>
										<template slot="append">单</template>
									</el-input>
								</el-form-item>
								<div style="width: 5px;"></div>
								<el-form-item style="margin-bottom: 0;">
									<el-input class="" v-model="orderDetail.backhaul_filterate_miss" :disabled="true" placeholder="请输入"
										clearable>
										<template slot="prepend">扣</template>
										<template slot="append">单</template>
									</el-input>
								</el-form-item>
							</el-form>
							<div style="color: rgb(237, 20, 61);margin-top: 10px;">回传{{orderDetail.backhaul_filterate_num}}单，后{{orderDetail.backhaul_filterate_miss}}单不回传</div>
						</el-descriptions-item>
						<el-descriptions-item v-if="orderDetail.status!=2" label="首充保护数">{{orderDetail.start_protect}}</el-descriptions-item>
						<el-descriptions-item v-if="orderDetail.status!=2" label="回传维度">{{orderDetail.backhaul_dimension_name}}</el-descriptions-item>
						<el-descriptions-item label="回传信息">{{orderDetail.info}}</el-descriptions-item>
					</el-descriptions>
				</template>
				<!-- 数据空 -->
				<template v-else-if="!initloadding">
					<el-empty :image-size="180" description="暂无该订单信息"></el-empty>
				</template>
			</div>
		</div>
		
	</el-dialog>
</template>

<script>
	export default {
		components: {},
		data() {
			return {
				refundReasonVisible: false,
				initloadding: false,
				visible: false,
				orderInfoData: {},
				orderDetail: {},
	
			}
		},
		created() {},
		mounted() {
	
		},
		computed: {
		
		},
		watch: {},
		methods: {
		
	
			init2(row) {
				this.visible = true;
				this.orderInfoData = row;
				this.initloadding = true;
				this.orderDetail = {};
				this.getBackhaulInfo(row);
			},
			async getBackhaulInfo(row) {
				const orderRes = await this.$axios.get(`/api/delivery/payment/backhaulInfo/${row.id}`);
				this.initloadding = false;
				console.log(145,orderRes);
				this.$nextTick(() => {
					this.orderDetail = orderRes;
					console.log(151,this.orderDetail);
				})
		
			},
		}
	}
</script>

<style lang="scss" scoped>
	:deep(.el-dialog__header) {
		padding: 20px 28px 10px 28px !important;
	}

	:deep(.el-dialog__body) {
		padding: 10px 25px 10px 25px !important;
	}

	:deep(.labelClass) {
		width: 125px;
	}

	:deep(.el-dialog__footer) {
		padding: 0px 25px 25px 25px !important;
	}

	:deep(.el-descriptions-item__cell) {
		padding: 12px 15px !important;
	}
	.selectItem{
		width: 300px;
	}
</style>